<template>
	<!-- 信息发布 -->
	<view class="">
		<view class="tab_list flex-cb bg-white">
			<view v-for="(item,index) in tablist" :key="index" :class="{item:index == isclass}" @click="handleitem(index)">
				{{item.name}}
			</view>
		</view>
		<scroll-view scroll-y="true" style="overflow: hidden;" @scrolltolower="scrolltolower" >
			<view v-for="(item,i) in list" :key="i" @click="handlelist(item)">
				<view v-if="item.type.name == tablist[isclass].name"  class="flex justify-between list bg-white">
					<view class="img">
						<image :src="src + item.images[0]" mode=""></image>
					</view>
					<view class="text">
						<view class="title">{{item.title}}</view>
						<view class="center">{{item.type.name}}类</view>
						<view class="time">{{item.created_at}}</view>
					</view>
				</view>
			</view>
			<nodata v-if="nodata" />
			<view class="flex-c" v-else>到底了~</view>
		</scroll-view>
		
		<view class="" >
			<image src="/static/index/icon_fb.png" mode="" class="position_img" @click="handlenavigeteto(1)"></image>
			<image src="/static/index/wdfb.png" mode="" class="position_img " @click="handlenavigeteto"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				src:'',
				isclass:0,
				tablist:[],
				list:[],
				last_page:1,
				page:1,
				limit:10,
				nodata:0,
				city:'',
				district:''
			}
		},
		onPullDownRefresh(){
			this.scrolltolower()
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},1000)
		},
		onLoad() {
			this.city = getApp().globalData.city
			this.district = getApp().globalData.district
			console.log(this.city);
			this.src = this.$base
			this.$api.types().then(res=>{
				this.tablist = res.data
			})
			this.getdata()
			this.nullfun()
			
		},
		onShow() {
			
		},
		methods: {
			handleitem(i){
				this.isclass = i
				this.nullfun()
			},
			getdata(){
				this.$api.TC_news({
					page:this.page,
					limit:this.limit,
					city:this.city,
					district:this.district
				},1).then(res=>{
					console.log(res);
					if(res.code == 200001){
						this.last_page = res.last_page
						if(res.list.length !=0){
							this.list = [...this.list,...res.list]
						}
					}
				})
			},
			handlelist(item){
				uni.navigateTo({
					url:'./details?id=' + item.id + '&type=' + item.type.name
				})
			},
			handlenavigeteto(i){
				if(i==1){
					uni.navigateTo({
						url:'./release'
					})
				}else{
					uni.navigateTo({
						url:'../my_release/my_release'
					})
				}
			},
			scrolltolower(){
				if(this.last_page == this.page){
					return
				}else{
					this.page ++
					this.getdata()
				}
			},
			nullfun(){
				let t = 0
				for (let i = 0; i < this.list.length; i++) {
					if(this.list[i].type.name == this.tablist[this.isclass].name){
						t++
						if(t >= 1){
							this.nodata = 0
							return
						}
					}else{
						this.nodata = 1
					}
				}
			}
		}
	}
</script>

<style lang="scss">
.tab_list{
	height: 96rpx;
	padding: 0 30rpx;
	font-size: 28rpx;
	.item{
		color: #333333;
		font-weight: bold;
		font-size: 30rpx;
	}
}
scroll-view{
	height: calc(100vh - 116rpx);
}
.list{
	margin: 20rpx 0;
	padding: 30rpx 28rpx 28rpx 20rpx;
	height: 280rpx;
	font-family: PingFang SC-Regular, PingFang SC;
	.img{
		margin-right: 30rpx;
		image{
			width: 218rpx;
			height: 222rpx;
			border-radius: 20rpx;
		}
	}
	.text{
		width: 454rpx;
		height: 92rpx;
		font-size: 30rpx;
		font-weight: 500;
		color: #333333;
		line-height: 50rpx;
		margin-bottom: 35rpx;
	}
	.center{
		width: 72rpx;
		height: 33rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #999999;
		line-height: 61rpx;
	}
	.time{
		width: 213rpx;
		height: 33rpx;
		white-space: nowrap;
		font-size: 24rpx;
		font-weight: 400;
		color: #999999;
		line-height: 61rpx;
		margin-top: 29rpx;
	}
}
.position_img{
	position: fixed;
	bottom: 253rpx;
	right: 30rpx;
	width: 100rpx;
	height: 100rpx;
	
}
.position_img:nth-last-of-type(1){
	bottom: 360rpx;
}
</style>
